@charset "utf-8";

.web_box {
    //banner
    .index_kv {
        width: 100%;
        height: 400px;
        overflow: hidden;
        margin-bottom: 81px;
        box-shadow: 0 10px 15px rgba(175, 23, 48, .1);
        img{
            width: 100%;
        }
    }
    //目录
    >p{
        margin-top: 27px;
        margin-bottom: 10px;
        a{
            img{
                vertical-align: middle;
                margin-left: 12px;
            }
        }
        
        a{
            color: #af1730;
        }
        a:last-child{
            color: #999;
        }
    }
    
    //文章
    .article{
        width: 1100px;
    }
    
    //健康资讯
    .article_info {
        padding-bottom: 150px;
        .other-article{
            width: 684px;
            margin: 70px auto;
            border-top: 3px solid #bbbaba;
            p{
                width: 167px;
                margin: 0 auto;
                text-align: center;
                font-size: 25px;
                color: #bbbaba;
                font-weight: bold;
                background: #fff;
                margin-top: -20px;
            }
        }
        ul {
            li {
                width: 352px;
                height: 360px; 
                padding-bottom: 50px;
                position: relative;
                box-shadow: 0 10px 15px rgba(175, 23, 48, .1);
                .h_img{
                    width: 100%;
                    height: 230px;
                    overflow: hidden;
                    margin-bottom: 35px;
                    img {
                        height: 100%;
                    }
                }
                h4 {
                    line-height: 28px;
                    font-weight: 400;
                    font-size: 17px;
                    color: #666666;
                    text-align: center;
                    position: relative;
                }
                p {
                    color: #999999;
                    font-size: 17px;
                    font-weight: bold;
                    padding: 0 20px;
                    height: 60px;
                    margin: 0 auto;
                    text-align: center;
                    line-height: 28px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 3;
                    -webkit-box-orient: vertical;
                }
                a {
                    position: absolute;
                    width: 144px;
                    left: 50%;
                    transform: translate(-50%, 50%);
                    background: linear-gradient(#ff0000, #b01730);
                    line-height: 50px;
                    color: #fff;
                    text-align: center;
                    font-size: 14px;
                    bottom: 0;
                }
                &:nth-child(2) {
                    margin: 0 72px;
                }
                &:hover {
                    transform: translateY(-20px);
                    box-shadow: 0 10px 15px rgba(175, 23, 48, .3);
                }
            }
        }
    }
}